<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <h3>实现就偶数的判断</h3>
    <input type="text" id="inp">
    <button id="btn">判断奇数偶数</button>
    <input type="text" id="res">

    <script>
        // 思路
        // 1 拿对象 --- 所有会用到的对象
        // 2 绑定点击事件


        // // 获取按钮对象
        // var oBtn = document.getElementById('btn') ;

        // // 给按钮绑定点击事件
        // oBtn.onclick = function() {
        //     // alert(666)
        //     // 获取输入框的值  
        //     //   获取输入框这个对象
        //     //   拿到这个对象的一个属性value

        //     // 注意：如果把获取对象写在点击事件里面，那么每一次点击都需要重新获取这个对象 --- 消耗性能
        //     var obj = document.getElementById('inp') ;  // 获取输入框这个对象
        //     var n = obj.value ;  // 获取这个输入框对象的一个属性叫value(获取输入框的值)
        //     alert(n) ;
        // }





        // 思路
        // 1 拿所有需要用到的对象
        // 2 点击事件
        //   2.1 那相关输入框的值


        // 1 拿对象
        var oInp = document.getElementById('inp') ;   // 拿输入框
        var oBtn = document.getElementById('btn') ;   // 拿按钮
        var oRes = document.getElementById('res') ;  // 拿结果框
        console.log(oInp , oBtn , oRes) ;

        // 2 点击事件  
        oBtn.onclick = function() {
            // 2.1 拿到输入框的值
            var n = oInp.value ;
            // 2.2 判断是不是偶数   --- 能不能被2整除
            //   注意：判断值是否相等要写== ===
            //      n是字符串，但是n % 2 会隐式转化为数字  ，所以写 ===
            if(n % 2 === 0) {
                // alert(n + '是一个偶数');
                // 2.3把结果放在框里面
                oRes.value = n + '是一个偶数' ;
            }
            else {
                // alert(n + '是一个奇数');
                oRes.value = n + '是一个奇数' ;
            }
        }

        





       





    </script>

</body>
</html>